import { PartnersBiddingDetail } from '@/lib/bidding/vendor/partners-bidding-detail'
import { Suspense } from 'react'
import { Skeleton } from '@/components/ui/skeleton'

import { getServerSession } from 'next-auth'
import { authOptions } from "@/app/api/auth/[...nextauth]/route"

interface PartnersBidDetailPageProps {
  params: Promise<{
    id: string
  }>
}

export default async function PartnersBidDetailPage(props: PartnersBidDetailPageProps) {
  const resolvedParams = await props.params
  const biddingId = parseInt(resolvedParams.id)

  if (isNaN(biddingId)) {
    return (
      <div className="container mx-auto py-6">
        <div className="text-center">
          <h1 className="text-2xl font-bold text-destructive">유효하지 않은 입찰 ID입니다.</h1>
        </div>
      </div>
    )
  }

  // 세션에서 companyId 가져오기
  const session = await getServerSession(authOptions)
  const companyId = session?.user?.companyId

  if (!companyId) {
    return (
      <div className="container mx-auto py-6">
        <div className="text-center">
          <h1 className="text-2xl font-bold text-destructive">회사 정보가 없습니다. 다시 로그인 해주세요.</h1>
        </div>
      </div>
    )
  }

  return (
    <div className="container mx-auto py-6">
      <Suspense fallback={<BiddingDetailSkeleton />}>
        <PartnersBiddingDetail
          biddingId={biddingId}
          companyId={companyId}
        />
      </Suspense>
    </div>
  )
}

function BiddingDetailSkeleton() {
  return (
    <div className="space-y-6">
      {/* 헤더 스켈레톤 */}
      <div className="flex items-center justify-between">
        <div className="space-y-2">
          <Skeleton className="h-8 w-64" />
          <Skeleton className="h-4 w-48" />
        </div>
      </div>

      {/* 입찰 공고 스켈레톤 */}
      <div className="space-y-4">
        <Skeleton className="h-8 w-32" />
        <div className="space-y-2">
          {Array.from({ length: 6 }).map((_, i) => (
            <Skeleton key={i} className="h-6 w-full" />
          ))}
        </div>
      </div>

      {/* 제시된 조건 스켈레톤 */}
      <div className="space-y-4">
        <Skeleton className="h-8 w-32" />
        <div className="space-y-2">
          {Array.from({ length: 3 }).map((_, i) => (
            <Skeleton key={i} className="h-12 w-full" />
          ))}
        </div>
      </div>

      {/* 응찰 폼 스켈레톤 */}
      <div className="space-y-4">
        <Skeleton className="h-8 w-32" />
        <div className="space-y-4">
          {Array.from({ length: 8 }).map((_, i) => (
            <Skeleton key={i} className="h-10 w-full" />
          ))}
          <Skeleton className="h-12 w-32" />
        </div>
      </div>
    </div>
  )
}